<!DOCTYPE html>

<html>
    <head>
        <meta charset="utf-8">
        <title>菜鸟教程(<runoob.com)</title>
        <style>
            ul.a {list-style-type: circle;}
            ul.b {list-style-type: square;}
            ol.c {list-style-type: upper-roman;}
            ol.d {list-style-type: lower-alpha;}
        </style>
    </head>

    <body>
        <p>无序列表实例：</p>
        <ul class="a">
            <li>Coffee</li>
            <li>Tea</li>
            <li>Coca Cola</li>
        </ul>

        <ul class="b">
            <li>Coffee</li>
            <li>Tea</li>
            <li>Coca Cola</li>
        </ul>

        <p>有序列表实例：</p>
        <ol class="c">
            <li>Coffee</li>
            <li>Tea</li>
            <li>Coca Cola</li>
        </ol>

        <ol class="d">
            <li>Coffee</li>
            <li>Tea</li>
            <li>Coca Cola</li>
        </ol>
    </body>
</html>